import { Meta, Story, Canvas } from '@storybook/addon-docs'
import store from '@/.storybook/store'
import OverviewEasyLanguage from '../../../pages/overviewEasyLanguage.vue'

<Meta
  title="Pages/Easy & Sign Language/Overview Easy Language"
  component={OverviewEasyLanguage}
  argTypes={{
    useStickyNavigation: { control: { type: 'boolean' } },
  }}
/>

export const Template = (args, { argTypes, viewMode }) => {
  return {
    props: Object.keys(argTypes),
    components: { OverviewEasyLanguage },
    store: store,
    template:
      '<OverviewEasyLanguage useStickyNavigation="useStickyNavigation" />',
  }
}

# Overview easy language example

Please use full width view in order to see the sticky navigation working correctly.

<a href="?path=/story/pages-easy-sign-language-overview-easy-language--example">
  Go to the Canvas Tab
</a>

---

<a
  href="?id=pages-easy-sign-language-overview-easy-language--example"
  target="_blank"
>
  Open in full width in a new tab
</a>

<Canvas>
  <Story
    name="Example"
    args={{
      useStickyNavigation: true,
    }}
  >
    {Template.bind({})}
  </Story>
</Canvas>

